<template>
  <div class='context-menu' v-bind:style="{left:this.pos.x+'px', top:this.pos.y+'px'}">
    <MyMenu v-bind:items="items" @mydeactivate="closeContentMenu" :context="context" />
  </div>
</template>

<script>
  import MyMenu from '../menu'
  import { setContext } from '../../commands'

  export default {
    components: {
      MyMenu
    },
    props: ['pos', 'items', 'context'],
    methods: {
      closeContentMenu: function () {
        this.$emit('myclosemenu')
      }
    },
    watch: {
      context: function () {
        if (this.context) {
          setContext(this.context)
        }
      }
    },
    mounted () {
      if (this.context) {
        setContext(this.context)
      }
    }
  }

</script>
